<template>
	<view class="container999" @touchstart="refreshStart" @touchmove="refreshMove" @touchend="refreshEnd">
		<refresh ref="refresh" @isRefresh="isRefresh"></refresh>
		<view class="nav"><navTab ref="navTab" :tabTitle="tabTitle" @changeTab="changeTab"></navTab></view>
		<!-- swiper切换 swiper-item表示一页 scroll-view表示滚动视窗 -->
		<swiper style="min-height: 100vh;" :current="currentTab" @change="swiperTab">
			<swiper-item v-for="(listItem, listIndex) in list" :key="listIndex">
				<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower="lower1" scroll-with-animation :scroll-into-view="toView">
					<view :id="'top' + listIndex" style="width: 100%;height: 120upx;"></view>
					<view class="content">
						<view class="cu-list menu">
							<view class="cu-item" v-for="(item, index) in listItem" :key="index">
								<view class="content padding-tb-sm">
									<!-- <view class="content padding-tb-sm" @click="toActivityUpdata(item.activity_no)"> -->
									<view class="titleWrap" @click.stop="toPreview(item.activity_no, item.status, item.fill_batch_no)">
										<view class="text-cut">{{ item.title }}</view>
										<text class="placehold"></text>
										<view class="cu-tag round " v-if="currentTab === 0" :class="item.status == '未开始' ? 'bg-orange' : item.status == '已结束' ? 'bg-grey' : 'bg-olive'">
											{{ item.status }}
										</view>
										<view class="cu-tag round " v-if="currentTab === 1" :class="item.state == '未完成' ? 'bg-orange' : item.status == '完成' ? 'bg-grey' : 'bg-olive'">
											{{ item.state }}
										</view>
									</view>
									<view class="text-gray text-sm" style="display: flex;">
										<view class="" @click="toViewList('view', item)">
											<text class="cuIcon-attentionfill margin-right-xs"></text>
											查看：
											<text class="text-blue">{{ item.view_count }}人</text>
										</view>
										<view class="" @click="toViewList('feedback', item)">
											<text class="placehold"></text>
											反馈：
											<text class="text-blue">{{ item.feedback_count }}人</text>
										</view>
									</view>
									<view class="text-gray text-sm">
										<text class="cuIcon-timefill margin-right-xs"></text>
										{{ item.create_time }}
									</view>
									<view class="action line_action">
										<!-- <view class="cuIcon-notice_forbid_fill text-gray">修改11</view> -->
										<view v-if="item.status === '未开始'" @click.stop="updateState(item)" class="btn release">发布</view>
										<view v-if="item.status === '未开始' || item.modify_after_submit === '是'" @click.stop="toUpdate(item.activity_no)" class="btn update_btn">修改</view>
										<view v-if="item.status !== '未开始' && currentTab === 0" @click.stop="toAnalyze(item.activity_no)" class="btn">分析</view>

										<!-- <button android:gravity='center_vertical' v-if="item.status === '未开始'" style="margin-right: 10upx;" @click.stop="updateState(item)" class="cu-btn sm round bg-green">发布</button>
										<button v-if="item.status === '未开始'" class="cu-btn sm round bg-cyan" @click.stop="toUpdate(item.activity_no)">修改</button> -->
									</view>
								</view>
							</view>
						</view>
					</view>
					<view class="noCard" v-if="list.length === 0">暂无信息</view>
					<view style="width: 100%;height: 100upx;opacity:0;">底部占位盒子</view>
				</scroll-view>
			</swiper-item>
		</swiper>
		<view class="cu-bar tabbar foot bg-white">
			<view class="action text-gray add-action" style="font-size: 28upx;">
				<button class="cu-btn cuIcon-add bg-green shadow" @click="toAdd"></button>
				创建
			</view>
		</view>
	</view>
</template>

<script>
const util = require('@/util/util.js');
import refresh from '@/components/tablist/refresh.vue';
import navTab from '@/components/tablist/navTab.vue';
import tabBar4 from '@/components/tablist/tabBar4.vue';
export default {
	components: { refresh, navTab, tabBar4 },
	data() {
		return {
			appName: 'daq',
			currentPage: 'index',
			toView: '', //回到顶部id
			tabTitle: ['我创建的', '我反馈的'], //导航栏格式 --导航栏组件
			currentTab: 0, //sweiper所在页
			pages: [1, 1, 1, 1], //第几个swiper的第几页
			list: [{}], //数据格式，
			pageInfo: {
				pageNo: 1,
				rownumber: 10,
				total: 0
			},
			currentLoginUser: '',
			questList: []
		};
	},
	onLoad(e) {
		let user = null;
		uni.getStorage({
			key: 'login_user_info',
			success(res) {
				user = res;
			}
		});
		console.log(user);
		this.currentLoginUser = user.data.user_no;
		uni.hideNavigationBarLoading();
		this.$nextTick(function() {
			this.getList(0);
		});
	},
	onShow() {
		// #ifdef H5
		// let isWeixinClient = this.isWeixinClient();
		// this.getSignature();
		this.$nextTick(function() {
			this.getList(this.currentTab);
		});
		// #endif
	},
	methods: {
		toActivityUpdata(e) {
			uni.navigateTo({
				url: '../activityUpdate/activityUpdate?activity_no=' + e
			});
		},
		toViewList(type, item) {
			console.log(type, item);
			if (this.currentTab === 0) {
				// 我创建的
				if ((type === 'view' && item.view_count !== 0) || (type === 'feedback' && item.feedback_count !== 0)) {
					uni.navigateTo({
						url: '../viewRecord/viewRecord?activity_no=' + item.activity_no + '&record_type=' + type
					});
				}
			}
		},
		toPreview(e, status, fill_batch_no) {
			console.log(e, status, fill_batch_no);
			let formType = 'detail';
			// if (this.currentTab === 0) {
			// 	formType = 'form';
			// }
			if (status !== '已结束') {
				if (fill_batch_no) {
					uni.navigateTo({
						url: `/pages/specific/questionnaire/questionnaire?formType=${formType}&activity_no=${e}&status=${status}&fill_batch_no=${fill_batch_no}`
					});
				} else {
					uni.navigateTo({
						url: `/pages/specific/questionnaire/questionnaire?formType=${formType}&activity_no=${e}&status=${status}`
					});
				}
			} else {
				uni.showToast({
					title: '已结束问卷不支持查看',
					icon: 'none'
				});
			}
		},

		toAdd() {
			uni.navigateTo({
				url: '/pages/specific/added/added?serviceName=' + 'srvdaq_activity_cfg_add' + '&type=add'
			});
		},
		toUpdate(e) {
			uni.navigateTo({
				url: '/pages/specific/activityUpdate/activityUpdate?activity_no=' + e
			});
		},
		toAnalyze(e) {
			uni.navigateTo({
				url: '/pages/specific/questionnaire/questionnaireAnalysis/questionnaireAnalysis?activity_no=' + e
			});
		},
		async updateState(e) {
			let reqData = [
				{
					status: '进行中'
				}
			];
			let url = this.getServiceUrl(this.appName ? this.appName : 'daq', 'srvdaq_activity_cfg_update', 'operate');
			let req = [
				{
					serviceName: 'srvdaq_activity_cfg_update',
					data: reqData,
					order: [{ colName: 'create_time', orderType: 'desc' }],
					condition: [
						{
							colName: 'id',
							ruleType: 'eq',
							value: e.id
						}
					]
				}
			];
			let response = await this.$http.post(url, req);
			if (response.data.resultCode === 'SUCCESS') {
				this.getList(this.currentTab);
			}
			console.log(response);
		},
		toTop() {
			this.toView = '';
			setTimeout(() => {
				this.toView = 'top' + this.currentTab;
			}, 10);
		},
		async getList(e) {
			let that = this;
			if (e === 0) {
				let url = this.getServiceUrl(this.appName ? this.appName : 'daq', 'srvdaq_activity_mine_select', 'select');
				let req = {
					serviceName: 'srvdaq_activity_mine_select',
					colNames: ['*'],
					order: [{ colName: 'create_time', orderType: 'desc' }],
					page: { pageNo: this.pageInfo.pageNo, rownumber: this.pageInfo.rownumber }
				};
				let response = await this.$http.post(url, req);
				if (response.data.state === 'SUCCESS' && response.data.data.length > 0) {
					let listData = response.data.data;
					this.pageInfo = response.data.page;
					if (this.pageInfo.pageNo === 1) {
						this.$set(this.list, e, listData);
					} else if (this.pageInfo.pageNo > 1) {
						listData = this.list[e].concat(listData);
						this.$set(this.list, e, listData);
						uni.showToast({
							title: '加载成功'
						});
					}
				}
			} else if (e === 1) {
				let url = this.getServiceUrl(this.appName ? this.appName : 'daq', 'srvdaq_activity_mine_feedback_select', 'select');
				let req = {
					serviceName: 'srvdaq_activity_mine_feedback_select',
					colNames: ['*'],
					order: [{ colName: 'create_time', orderType: 'desc' }],
					page: { pageNo: this.pageInfo.pageNo, rownumber: this.pageInfo.rownumber }
				};
				let response = await this.$http.post(url, req);
				console.log(response.data.data);
				if (response.data.state === 'SUCCESS' && response.data.data.length > 0) {
					// this.$set(this.list, e, response.data.data);
					let questList = [];
					for (let item of response.data.data) {
						let list = await this.getFeedbackList(item);
						if (Array.isArray(list)) {
							questList = questList.concat(list);
							this.$set(this.list, e, questList);
						}
					}
					this.questList = questList;
					// response.data.data.forEach(item => {
					// 	this.getFeedbackList(item).then(list => {
					// 		console.log(questList);
					// 		questList = [...questList, ...list];
					// 		this.questList = questList;
					// 		this.$set(this.list, e, questList);
					// 	});
					// });
				}
			}
		},
		async getFeedbackList(item) {
			// 反馈列表
			let url = this.getServiceUrl(this.appName ? this.appName : 'daq', 'srvdaq_record_reply_select', 'select');
			let req = {
				serviceName: 'srvdaq_record_reply_select',
				colNames: ['*'],
				condition: [
					{
						colName: 'activity_no',
						ruleType: 'in',
						value: item.activity_no
					},
					{
						colName: 'user_no',
						ruleType: 'in',
						value: this.currentLoginUser
					}
				],
				order: [{ colName: 'create_time', orderType: 'desc' }]
			};
			let response2 = await this.$http.post(url, req);
			if (response2.data.state === 'SUCCESS') {
				let questList = response2.data.data;
				questList.forEach(quest => {
					quest = Object.assign(quest, item);
					return quest;
				});
				return questList;
			}
		},
		changeTab(index = 0) {
			this.pageInfo = {
				pageNo: 1,
				rownumber: 10,
				total: 0
			};
			this.currentTab = index;
			console.log(index);
			this.getList(index);
		},
		// 其他请求事件 当然刷新和其他请求可以写一起 多一层判断。
		isRequest() {
			return new Promise((resolve, reject) => {
				this.pages[this.currentTab]++;
				var that = this;
				this.pageInfo.pageNo++;
				this.getList(this.currentTab);
				setTimeout(() => {
					// uni.showToast({
					// 	icon: 'none',
					// 	title: `请求第${that.currentTab + 1}个导航栏的第${that.pages[that.currentTab]}页数据成功`
					// });
					// let newData = ['新数据1', '新数据2', '新数据3'];
					// resolve(newData);
				}, 1000);
			});
		},
		// swiper 滑动
		swiperTab: function(e) {
			var index = e.detail.current; //获取索引
			this.$refs.navTab.longClick(index);
		},
		// 加载更多 util.throttle为防抖函数
		lower1: util.throttle(function(e) {
			console.log('lower1');
			const page = this.pageInfo;
			const self = this;
			if (page.rownumber * page.pageNo >= page.total) {
				uni.showToast({
					title: '已经没有数据了...',
					icon: 'none'
				});
			} else {
				console.log(`加载${this.currentTab}`); //currentTab表示当前所在页数 根据当前所在页数发起请求并带上page页数
				let page = this.pageInfo;
				self.isRequest().then(res => {
					let tempList = self.list;
					tempList[self.currentTab] = tempList[self.currentTab].concat(res);
					console.log(tempList);
					self.list = tempList;
					self.$forceUpdate(); //二维数组，开启强制渲染
				});
			}
		}, 300),
		// 刷新touch监听
		refreshStart(e) {
			this.$refs.refresh.refreshStart(e);
		},
		refreshMove(e) {
			this.$refs.refresh.refreshMove(e);
		},
		refreshEnd(e) {
			this.$refs.refresh.refreshEnd(e);
		},
		isRefresh() {
			this.pageInfo = {
				pageNo: 1,
				rownumber: 10,
				total: 0
			};
			this.getList(this.currentTab);
			setTimeout(() => {
				uni.showToast({
					icon: 'success',
					title: '刷新成功'
				});
				this.$refs.refresh.endAfter(); //刷新结束调用
			}, 1000);
		},
		getSignature(formData) {
			let self = this;
			let linkurl = '';
			// #ifdef H5
			window.location.href.split('#')[0];
			// #endif
			let req = {
				serviceName: 'srvwx_app_signature_select',
				colNames: ['*'],
				condition: [
					{
						colName: 'app_no',
						ruleType: 'eq',
						value: this.$api.appNo.wxmp
						// value: this.$api.appNo.wxh5
					},
					{
						colName: 'page_url',
						ruleType: 'eq',
						value: linkurl
					}
				]
			};
			console.log('linkurl', linkurl);
			uni.setStorageSync('linkUrl', null);
			self.$http.post(self.$api.getSignature, req).then(res => {
				if (res.data.state === 'SUCCESS') {
					let resData = res.data.data[0];
					uni.setStorageSync('signatureInfo', resData);
					// #ifdef H5
					self.$wx.config({
						debug: false, // 调试阶段建议开启
						appId: resData.appId, // APPID
						timestamp: resData.timestamp, // 时间戳timestamp
						nonceStr: resData.noncestr, // 随机数nonceStr
						signature: resData.signature, // 签名signature
						// 需要调用的方法接口
						jsApiList: [
							'updateAppMessageShareData',
							'updateTimelineShareData',
							'onMenuShareTimeline',
							'onMenuShareAppMessage',
							'onMenuShareWeibo',
							'onMenuShareQQ',
							'onMenuShareQZone'
						]
					});
					self.$wx.ready(() => {
						console.log('wx.ready()', self.wxUserInfo);
						self.$wx.updateAppMessageShareData({
							//自定义“分享给朋友”及“分享到QQ”按钮的分享内容
							imgUrl: self.wxUserInfo.headimgurl, // 分享图，默认当相对路径处理，所以使用绝对路径的的话，“http://”协议前缀必须在。
							desc: '百想健康', // 摘要,如果分享到朋友圈的话，不显示摘要。
							title: '百想健康', // 分享卡片标题
							// link:  window.location.href, // 分享出去后的链接，这里可以将链接设置为另一个页面。
							link: linkurl, // 分享出去后的链接，这里可以将链接设置为另一个页面。
							success: function() {
								// 分享成功后的回调函数
							},
							cancel: function() {
								// 用户取消分享后执行的回调函数
								// //// alert('分享失败')
							}
						}); // 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容
						self.$wx.updateTimelineShareData({
							imgUrl: self.formData.fileUrl, // 分享图，默认当相对路径处理，所以使用绝对路径的的话，“http://”协议前缀必须在。
							desc: '百想健康', // 摘要,如果分享到朋友圈的话，不显示摘要。
							title: '百想健康', // 分享卡片标题
							link: linkurl, // 分享出去后的链接，这里可以将链接设置为另一个页面。
							success: function() {
								// 分享成功后的回调函数
							},
							cancel: function() {
								// 用户取消分享后执行的回调函数
								// //// alert('分享失败')
							}
						});
					});
					self.$wx.error(function(res) {
						uni.showModal({
							title: '提示',
							content: JSON.stringify(res),
							success() {}
						});
					});
					// #endif
				} else {
					uni.showToast({
						title: '获取签名失败',
						icon: 'none'
					});
				}
			});
		},
	}
};
</script>

<style lang="scss" scoped>
uni-app,
uni-page-head {
	display: none;
}

.container999 {
	width: 100vw;
	font-size: 28upx;
	min-height: 100vh;
	overflow: hidden;
	color: #6b8082;
	position: relative;
	background-color: #f6f6f6;
}
.content {
	width: 100%;
	.text-sm {
		font-size: 30upx;
	}
}
.placehold {
	display: inline-block;
	width: 25upx;
	opacity: 0;
}
.card {
	width: 90%;
	height: 368upx;
	background-color: white;
	margin: 0 auto 42upx auto;
	background: #ffffff;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	position: relative;
}
.text-cut {
	font-size: 30upx;
	font-weight: bold;
}
.titleWrap {
	margin-bottom: 10upx;
}
.noCard {
	width: 90%;
	height: 200upx;
	margin: auto;
	background-color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #999999;
	box-shadow: 0 0 10upx 0 rgba(0, 0, 0, 0.1);
	border-radius: 10upx;
}
.nav {
	position: fixed;
	left: 0;
	top: 0;
	color: white;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	font-size: 24upx;
	background-color: #50b7ea;
	z-index: 996;
}

.searchInput999 {
	width: 90%;
	padding: 10upx;
	margin: 12upx auto;
	background: white;
	border-radius: 30upx;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 66upx;
}
.line_action {
	display: flex;
	justify-content: flex-end;
	text-align: right;
	.btn {
		color: white;
		background-color: #8dc63f;
		border-radius: 20upx;
		padding: 0upx 18upx;
		font-size: 30upx;
		margin-right: 5px;
		&.release {
			// 发布
			background-color: #2979ff;
		}
		&.update_btn {
			// 编辑
			background-color: #1cbbb4;
		}
	}
}
.search999 {
	width: 32upx;
	height: 32upx;
}

.searchBox999 {
	width: 56upx;
	height: 56upx;
	display: flex;
	justify-content: center;
	align-items: center;
}

.input999 {
	color: #999;
	width: 80%;
}
.navTabBox {
	font-size: 16px;
}
</style>
